<template>
  <div class="custom-bread-crumb">
    <!-- <Breadcrumb :style="{fontSize: `${fontSize}px`}">
      <BreadcrumbItem v-for="item in list" :to="item.to" :key="`bread-crumb-${item.name}`">
        <common-icon style="margin-right: 4px;" :type="item.icon || ''"/>
        {{ showTitle(item) }}
      </BreadcrumbItem>
    </Breadcrumb> -->
    <Menu mode="horizontal" theme="dark" active-name="1" style="background:inherit">
            <MenuItem name="1">
               <img src="../../../../../assets/images/menu/topIcon_09.png">
              全网数据
            </MenuItem>
            <MenuItem name="2">
                <img src="../../../../../assets/images/menu/topIcon_11.png">
            全网调控
            </MenuItem>
            <MenuItem name="3">
                <img src="../../../../../assets/images/menu/topIcon_13.png">
              系统管理
            </MenuItem>
            <MenuItem name="4">
                <img src="../../../../../assets/images/menu/topIcon_15.png">
              调度管理
            </MenuItem>
            <MenuItem name="5">
                <img src="../../../../../assets/images/menu/topIcon_17.png">
              能耗分析
            </MenuItem>
        </Menu>
  </div>
</template>
<script>
import { showTitle } from '@/libs/util'
import CommonIcon from '_c/common-icon'
import './custom-bread-crumb.less'
export default {
  name: 'customBreadCrumb',
  components: {
    CommonIcon
  },
  props: {
    list: {
      type: Array,
      default: () => []
    },
    fontSize: {
      type: Number,
      default: 14
    },
    showIcon: {
      type: Boolean,
      default: false
    }
  },
  methods: {
    showTitle (item) {
			console.log(item);
      return showTitle(item, this)
    },
    isCustomIcon (iconName) {
      return iconName.indexOf('_') === 0
    },
    getCustomIconName (iconName) {
      return iconName.slice(1)
    }
  }
}
</script>
